<template>
    <div>
      <el-card shadow="always" :body-style="{ padding: '20px' }">
        <template #header>
          <div>
            <span>
              <el-button type="primary" size="default" :icon="Plus"
                >添加</el-button
              >
            </span>
          </div>
        </template>
        <!-- card body -->
        <el-table border stripe>
          <el-table-column
            label="序号"
            type="index"
            width="80"
            align="center"
          ></el-table-column>
          <el-table-column label="品牌名称"></el-table-column>
          <el-table-column label="品牌Logo"></el-table-column>
          <el-table-column label="操作"></el-table-column>
        </el-table>
        <!-- 
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
         -->
        <el-pagination
          v-model:currentPage="currentPage"
          v-model:page-size="pageSize"
          :page-sizes="[3, 5, 7, 9]"
          :pager-count="7"
          layout="total, sizes, prev, pager, next, jumper"
          :total="total"
        />
      </el-card>
    </div>
  </template>
  
  <script lang="ts">
  import { defineComponent } from "vue";
  
  export default defineComponent({
    name: "Tradmark",
  });
  </script>
  
  <script setup lang="ts">
  import { ref } from "vue";
  import { Plus } from "@element-plus/icons-vue";
  const currentPage = ref(1);
  const pageSize = ref(10);
  const total = ref(400);
  </script>
  